﻿<!DOCTYPE html>
<html>
<head>
    <title>自定义控件属性</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <!--bootStrop css 单选框样式-->
    <link rel="stylesheet" href="resources/scripts/assets/bootstrap/css/icheck-bootstrap.css">
    <!--bootStrop css 主样式-->
    <link rel="stylesheet" href="resources/scripts/assets/bootstrap/css/bootstrap.min.css">
    <!--jquery js-->
    <script src="resources/scripts/assets/js/jquery-2.2.3.min.js"></script>
    <!--bootStrop js-->
    <script src="resources/scripts/assets/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<form class="form-inline">
    名称:<input type="text" placeholder="症状" class="form-control">
    <div class="icheck-info">
        <input type="checkbox" id="someCheckboxId1"/>
        <label for="someCheckboxId1">是否必填</label>
    </div>
    <div class="icheck-info">
        <input type="checkbox" id="someCheckboxId2"/>
        <label for="someCheckboxId2">是否可搜索</label>
    </div>
    <div class="icheck-info">
        <input type="checkbox" id="someCheckboxId3"/>
        <label for="someCheckboxId3">是否隐私项</label>
    </div>
    <br/>
    内容:<input type="button" class="btn btn-warning" value="选择术语" data-toggle="modal" data-target="#myModal">
    <br/><br/>
    <img src="images/自定义控件属性/u602.png">
    <input type="text" class="form-control" value="头痛"><br/><br/>
    <img src="images/自定义控件属性/u602.png">
    <input type="text" class="form-control" value="发热"><br/><br/>
    <img src="images/自定义控件属性/u602.png">
    <input type="text" class="form-control" value="胸闷"><br/><br/>
    <img src="images/自定义控件属性/u602.png">
    <input type="text" class="form-control" value=""><br/><br/>
    <img src="images/自定义控件属性/u613.png">
    <input type="button" class="btn btn-default" value="合并术语"><br/><br/>
    来源:
    <select class="form-control">
        <option>请选择</option>
        <option>手工录入</option>
        <option>移动app</option>
        <option>网页</option>
        <option>微信</option>
    </select>
    <br/><br/>
    分类:
    <select class="form-control">
        <option>请选择</option>
        <option>症状</option>
        <option>分类1</option>
        <option>分类2</option>
    </select>
</form>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel"><strong style="color: #2aabd2;text-align: center"><h4>
                    术语字典选择</h4></strong></h4>
            </div>
            <div class="modal-body">
                <form class="form-inline">
                    <select class="form-control col-lg-offset-4" style="width: 200px">
                        <option>请选择</option>
                        <option>症状</option>
                    </select>
                    <br/><br/>
                    <div class="col-lg-offset-1">
                        术语详情
                        <br/><br/>
                    </div>
                    <div class="col-lg-offset-3">
                        <div class="col-lg-6">
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId4"/>
                                <label for="someCheckboxId4">头痛</label>
                            </div>
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId5"/>
                                <label for="someCheckboxId5">发热</label>
                            </div>
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId6"/>
                                <label for="someCheckboxId6">胸闷</label>
                            </div>
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId7"/>
                                <label for="someCheckboxId7">呕吐</label>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId8"/>
                                <label for="someCheckboxId8">头晕</label>
                            </div>
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId9"/>
                                <label for="someCheckboxId9">咳嗽</label>
                            </div>
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId10"/>
                                <label for="someCheckboxId10">胸痛</label>
                            </div>
                            <div class="icheck-info">
                                <input type="checkbox" id="someCheckboxId11"/>
                                <label for="someCheckboxId11">心衰</label>
                            </div>
                        </div>
                    </div>
                </form>
                <br/><br/><br/><br/><br/><br/><br/>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-info">确定</button>
            </div>
        </div>
    </div>
</div>
</body>
</html>